<!--
 * @Author: dfh
 * @Date: 2024-03-19 18:05:19
 * @LastEditors: dfh
 * @Modified By: dfh
 * @describe: 
-->
<template>
    <view class="container" v-if="bankList && bankList.length>0">
        <view class="card">
            <view class="flex ai-center jc-between" @click="navigateTo">
                <view class="flex ai-center" >
                    <text class="txt-black-34 txt-30">存款利率</text>
                    <!-- <text class="iconfont icon-meiguoguoqi ml-30 txt-24 txt-orange-254"></text>
                    <text class="txt-black-32 txt-24 ml-10">USD</text>
                    <text class="iconfont icon-country-zh-cn ml-30 txt-24 txt-orange-254"></text>
                    <text class="txt-black-32 txt-24 ml-10">HKD</text> -->
                </view>
                <text class="iconfont icon-arrow-right-bold txt-black-102 txt-30"></text>
            </view>
            <view class="flex ai-center mt-30">
                <text class="txt-black-102 txt-24 flex-1">银行</text>
                <text class="txt-black-102 txt-24 flex-1">1个月</text>
                <text class="txt-black-102 txt-24 flex-1">3个月</text>
                <text class="txt-black-102 txt-24 flex-1">6个月</text>
                <!-- <text class="txt-black-102 txt-24 flex-1">12个月</text> -->
            </view>
            <view class="flex ai-center mt-20" v-for="(item,index) in data" :key="index">
                <text class="txt-black-34 txt-24 flex-1">{{ item.name }}</text>
                <text class="txt-black-34 txt-24 flex-1" v-for="(o,i) in item.bankRateReps" :key="i">{{ o.saveRate }}%</text>
            </view>

        </view>
    </view>
</template>

<script setup>
defineProps({
    data: {
        type: Array,
        default: () => []
    },
    bankList:{
        type: Array,
        default: () => []
    },
})

const navigateTo=()=>{
    uni.navigateTo({url:"/pages/bankCard/interestRateList"})
}
</script>

<style lang="scss" scoped>
.container {
    width: 100%;
    box-sizing: border-box;
    padding: 30rpx 20rpx;

    .card {
        width: 100%;
        display: flex;
        flex-direction: column;
        background-color: white;
        border-radius: 30rpx;
        padding: 30rpx;
        box-sizing: border-box;
    }
}
</style>